
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
%>



<ul class="ul${c.id}">
<c:forEach items="${requestScope.childrenComments}" var="c">
    <li style="border-left:1px dashed #d0d0d0">
        <div class="us">
            <img src="<%=path%>/static/images/1.jpg" alt="评论者">
            <span>${c.userinfo.nickname}   回复</span>
            <span>${c.inputTime}</span>
            <c:if test="${sessionScope.userinfo ne null}">
            <span><a href="#submitComment" class="toWriteComment" onclick="toWriteComment(this);" data-pn="${c.userinfo.nickname}" data-pi="${c.id}">回复TA</a> </span>
            </c:if>
        </div>
        <h3>${c.content}</h3>
        <c:if test="${c.childrenCount ne 0}">
           <ul class="ul${c.id}" ><%--往下一层的子级评论放在这个ul里面--%>
              <li class="li${c.id}"><a href="javascript:void(0);" class="getChildrenComments" data-id="${c.id}"> 显示${c.childrenCount}条回复</a></li>
           </ul>
        </c:if>
    </li>
</c:forEach>
</ul>

<script src="<%=path%>/static/js/jquery-3.3.1.min.js"></script>
<script>

    $(function () {
        $(".getChildrenComments").click(function () {//给获取子级评论的a标签添加点击事件
            var id = $(this).data("id");
            $.ajax({
                url:"<%=path%>/web/article/childrenCommentData?id="+id,
                async:false,
                data:{id:id},
                type:"GET",
                success:function (data) {
                    $(".ul"+id).html(data);
                }
            })
        });
    })
</script>